import styles from './index.module.less'
import React from 'react'

interface IconProps {
  iconName: string // 声明可接收的图标名称参数
  className?: string // 可选类名参数
  color?: string // 可选颜色参数
  size?: string // 可选大小参数
  onClick?: (e:any) => void // 可选点击事件处理程序
}

const Icon: React.FC<IconProps> = ({ iconName, className = '', color, size, onClick = () => {} }) => {
  return (
    <svg
      onClick={e => onClick(e)}
      className={`${styles.icon} ${className}`}
      style={{
        color, // 应用颜色参数
        fontSize: size // 应用大小参数
      }}
      aria-hidden='true'
    >
      <use xlinkHref={`#${iconName}`} /> {/* 使用传入的图标名称参数 */}
    </svg>
  )
}

export default Icon
